<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>雷达图案例</title>
		<!-- 引入 ECharts 文件 -->
		<script src="js/echarts.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- 为 ECharts 准备一个具备大小（宽高）的 容器 -->
		<div id="chart1" style="width: 400px;height: 400px;border: 1px solid #000; margin-left: 80px;"></div>
	</body>
</html>
<script type="text/javascript">
	// 基于准备好的容器(这里的容器是id为chart1的div)，初始化echarts实例
	var chart1 = echarts.init(document.getElementById("chart1"));
	
	// 指定图表的配置项和数据
	var option = { 
	    title: {
			text: '您跑赢了32%资产相近的客户',
			// link: 'https://blog.csdn.net/gray_key',
			// target: 'blank',
			top: '90%',
			left: '23%',
			textStyle: {
				color: '#666',
				fontSize: 14,
			}
		},
	    radar: [{                       
	        // center: ['50%', '50%'],            
	        radius: 70,                        
	        // startAngle: 90,                    
	        name: {                            
	            formatter: '{value}',
	            textStyle: {
	                fontSize: 12,
	                color: '#A2A5A9'
	            }
	        },
	        nameGap: 15,                        
	        splitNumber: 4,                    
	        shape: 'polygon',                   
	        axisLine: {                        
	            lineStyle: {
	                color: '#fff',                   
	                width: 0,                      	
	                type: 'solid',                   
	            }
	        },
	        splitLine: {                        
	            lineStyle: {
	                color: '#313339',                       
	                width: 2, 							
	            }
	        },
	        splitArea: {                        
	            show: true,
	            areaStyle: {                           
	                color: ['rgba(250,250,250,0.9)','rgba(200,200,200,0.3)'],       
	            }
	        },
	        indicator: [{text : '收益能力',max:100},
                    {text : '风险控制',max:100},
                    {text : '盘面感知',max:100},
                    {text : '仓位控制',max:100},
                    {text : '选股能力',max:100}]
	    }],
	    series: [{
	        name: '雷达图',            
	        type: 'radar',              
	        itemStyle: {                
	            normal: {                  
	                lineStyle: {
	                    width: 0
	                },
	                opacity: 0
	            },
	            emphasis: {                 
	                lineStyle: {
	                    width: 0
	                },
	                opacity: 1
	            }
	        },
	        data: [{                    
	            name: '女',                
	            value: [85, 63, 37, 20, 84],        
	            symbol: 'circle',                  
	            symbolSize: 5,                     
	            label: {                                        
	                    normal: {  
	                        show: true ,            
	                        position: 'top',        
	                        distance: 3,           
	                        color: '#A2A5A9',          
	                        fontSize: 14,          
	                        formatter:function(params) {  
	                            return params.value;  
	                        }  
	                    }  
	                },
	            itemStyle: {                
	                normal: {
	                    borderColor: '#285DAD',       
	                    borderWidth: 8,                        
	                }
	            },
	            lineStyle: {                
	                normal: {
                      opacity: 0.5          
	                }
	            },
	            areaStyle: {                
	                normal: {
	                    color: '#285DAD'       
	                }
	            }
          }
        ]
	    }, ]
	};
	
	// 使用刚指定的配置项和数据显示图表
  chart1.setOption(option)
  </script>